﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CheckAndSubmitForm.aspx.cs" Inherits="ZLCMS.Web.Wap.Example.CheckAndSubmitForm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
	<link rel="stylesheet" href="/wap/lib/jquerymobile/css/jquery.mobile-1.4.0.min.css" />
	<link rel="stylesheet" href="/wap/lib/validator-0.7.0/css/jquery.validator.css" />

	<script type="text/javascript" src="/wap/lib/jquery/jquery-1.10.2.min.js"></script>
	<script type="text/javascript" src="/wap/lib/jquerymobile/jquery.mobile-1.4.0.min.js"></script> 
    <script type="text/javascript" src="/wap/lib/validator-0.7.0/jquery.validator.js"></script>
    <script type="text/javascript" src="/wap/lib/validator-0.7.0/local/zh_CN.js"></script>
    
	<script type="text/javascript" src="/wap/lib/jquery/jquery.json-2.2.min.js"></script>
    <script type="text/javascript" src="/wap/lib/command/Command.js"></script>
</head>

<body>

<div data-role='page' id='mainPage'>
<div data-role="header">
   <div class="logo"></div>
</div>
<div role="main" class="ui-content">
<form id="formId" command='CommonWxApply'>
    <label for="text-basic">姓名:</label>
    <input name="name" value="" command-param='ApplyItem1' type="text" data-rule="required" />
    <div><span for="name" class="msg-box"></span></div>    

    <label for="text-basic">电话:</label>
    <input name="phone" value="" type="tel" command-param='ApplyItem2' type="text" data-rule="required;mobile"/>
    <div><span for="phone" class="msg-box"></span></div>
    
    <fieldset data-role="controlgroup" data-mini="true" command-param='ApplyItem3'>
    <legend>性别:</legend>
        <input name="sex" id="radio1" value="1" data-rule="checked" type="radio" />
        <label for="radio1">男</label>
        <input name="sex" id="radio2" value="2" type="radio"/>
        <label for="radio2">女</label>  
    </fieldset>
    <div><span class="msg-box" for="sex"></span></div>

    <fieldset data-role="controlgroup" data-mini="true">
        <legend>子女数:</legend>
        <select name="select-native-5" id="select-native-5" data-rule="selectval" command-param='ApplyItem4' >
            <option value="-1">--请选择--</option>
            <option value="1">1个</option>
            <option value="2">2个</option>
        </select>
    </fieldset>
    <div><span class="msg-box" for="select-native-5"></span></div>

    <fieldset data-role="controlgroup" data-mini="true" command-param='ApplyItem5'>
        <legend>爱好:</legend>
        <input name="ah" id="checkbox-v-2a" type="checkbox" data-rule="checked" value="篮球" / >
        <label for="checkbox-v-2a">篮球</label>
        <input name="ah" id="checkbox-v-2b" type="checkbox" value="羽毛球"/>
        <label for="checkbox-v-2b">羽毛球</label>
        <input name="ah" id="checkbox-v-2c" type="checkbox" value="游泳"/>
        <label for="checkbox-v-2c">游泳</label>
    </fieldset>
    <div><span class="msg-box" for="ah"></span></div>
    
    <button class="ui-btn" type="button" onclick="executeFormCommonCommand('formId', applyDone)">提交</button>
    <a id="showmessage" href="#dialogPage" style="display:none">#</a>
</form>
</div>

<!--footer-->
<div data-role="footer">
	<p>footer</p>
</div>
</div>


<div data-role='dialog' id='dialogPage'>
<div data-role='header'>
<a class="ui-btn ui-corner-all ui-icon-delete ui-btn-icon-notext ui-btn-left" role="button" href="#" onclick="$('#dialogPage').dialog('close')">Close</a>
<h2>提示</h2>
</div>
<div role='main' class='ui-content'>
<p></p>
</div>
</div>

<script type="text/javascript">
    function applyDone() {
        try {
            showDialogPage('成功', '操作成功');
        } catch (e) {
            $('<a id="showmessage" href="#dialogPage" style="display:none">#</a>').click();
        }
        $("#btapply").text("已提交");
        $("#btapply").attr("disabled", "disabled");
    }
    $('#formId').openJQMValidator();
</script>
</body>
</html>
